<template>
    <div class="successBox">
        <van-nav-bar title="充值成功页" />
        <van-empty image="@/image/imgSuccess.jpg" image-size="80" description="充值成功">
            <van-button type="primary" to="/mywallet">立即查看</van-button>
        </van-empty>
        <div class="successListBox">
             <dl v-for="(item, index) in doctorList" :key="index"> 
                <dt>
                    <img :src="item.imagePic" alt="">
                </dt>
                <dd>
                    <ul>
                        <li style="display: flex; align-items: center;">
                            <h3>{{ item.doctorName }}</h3>
                            &emsp;&emsp;
                            <h6>{{ item.jobTitle}}</h6>
                        </li>
                        <li>{{ item.inauguralHospital }}</li>
                        <li style="display: flex; align-items: center;font-size: 12px;">好评率&emsp13;
                            <span>{{ item.praise }}</span>&emsp13;
                            服务患者数&emsp13;
                            <span>{{ item.servicePrice }}</span>
                        </li>
                    </ul>
                    <el-button type="primary" style="margin-top: 10px;">立即咨询</el-button>
                </dd>
            </dl>
        </div>
    </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { getDoctor } from '@/api/index'
// import axios from 'axios';

interface Doctor {
    doctorName:string,
    imagePic: string,
    jobTitle: string,
    inauguralHospital: string,
    praise: number,
    servicePrice: number
}
const config = ref({
    deptId: 2,
    condition: 1,
    sortBy: 1,
    page: 1,
    count: 5
})
const doctorList = ref<Doctor []>([])
getDoctor(config.value).then(res => {
    console.log(res.data);
    const { result } = res.data
    doctorList.value = result
})
// interface Doctor {
//     img: string,
//     title: string,
//     address: string,
//     favorable: number,
//     price: number
// }
// const DoctorList = ref<Doctor[]>([])

// const getDoctorList = async () => {
//     const res = await axios.get('/v3/doctorlist')
//     console.log(res.data);
//     const { doctorList } = res.data
//     DoctorList.value = doctorList
// }
// getDoctorList()

</script>

<style lang="scss">
@import './index.scss';
</style>